<template>
	<view class="content">
		<view class="uni-margin-wrap">
			<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
				:duration="duration">
				<swiper-item v-for="item in background">
					<!-- <viewuni-bg-red">A</view> -->
					<image class="swiper-item" :src="item" mode="widthFix"></image>
				</swiper-item>
			</swiper>
		</view>
		<van-button>sdfsdfsf</van-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background: ['https://img1.baidu.com/it/u=3232446471,158203584&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
					'https://img2.baidu.com/it/u=1323822237,230137810&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
					'https://img0.baidu.com/it/u=3311214774,3356024148&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=495'
				],
				indicatorDots: true,
				autoplay: true,
				interval: 2000,
				duration: 500
			}
		},
		methods: {

		}
	}
</script>

<style lang="less">
	.content {
		.uni-margin-wrap {
			.swiper {
				width: 100%;
				height: 400rpx;

				swiper-item {
					width: 100%;
					image{
					width: 100%;
					// height: 300px;	
					}
				}
			}
		}
	}
</style>
